/**
 * Created by Delicate on 2018/1/12.
 */
import React from 'react';
import {
    StyleSheet,
    View,
    ScrollView,
    DeviceEventEmitter
} from 'react-native';
import DeviceInfo from 'react-native-device-info'
import Toast from 'react-native-simple-toast'

import NavBar from '../../components/NavBarView'
import Menu from '../../components/HorizontalMenuView'
import {
    SubmitBtn,
    FormStatus
} from '../../components/Form'
import VersionUpdate from '../../components/VersionUpdateModal'
import Constants from '../../config/Constants'
import PassportService from '../../services/Passport'
import SystemService from '../../services/System'

let _self;

class Views extends React.Component {

    constructor(props) {
        super(props);
        _self = this;
        this.state = {
            visible: false
        }
    }

    componentWillMount() {

    }

    componentDidMount() {

    }

    skip(path, params) {
        _self.props.navigation.navigate(path, params);
    }

    async logout() {
        const {result, message} = await PassportService.logout();
        if (result) {
            DeviceEventEmitter.emit(Constants.LISTENER_LOGGING);
            _self.props.navigation.goBack();
        }
        Toast.show(message);
    }

    async update() {
        const {result, message, data} = await SystemService.splash();
        if (result) {
            const currentVersion = data.version;
            const localVersion = DeviceInfo.getVersion();
            if (currentVersion.version !== localVersion) {
                global.config = {
                    isFirst: currentVersion.open_guide === 1,
                    update: {
                        version: currentVersion.version,
                        content: currentVersion.version_log,
                        size: currentVersion.version_size,
                        url: currentVersion.upload_url
                    },
                    version: localVersion
                };
                _self.setState({
                    visible: true
                })
            }else {
                Toast.show('已经是最新版本!');
            }
        } else {
            Toast.show(message);
        }
    }

    render() {
        return (
            <View style={base.baseOuter}>
                <NavBar host={this} title="设置"/>
                <ScrollView style={styles.container}>
                    <View style={styles.box}>
                        <Menu
                            rightShow={false}
                            text="手机号码"
                            subText={user.user_name}/>
                        <Menu text="修改密码" onPress={() => this.skip('Modify')}/>
                        <Menu subText={'V '+DeviceInfo.getVersion()} last={true} text="检查更新" onPress={() => this.update()}/>
                    </View>
                    <View style={styles.box}>
                        <SubmitBtn
                            style={styles.btn}
                            textColor={layout.FORM_FONT_COLOR}
                            readyColor="#fff"
                            control={FormStatus.READY}
                            text="退出登录"
                            onPress={() => this.logout()}/>
                    </View>
                </ScrollView>
                <VersionUpdate cancel={()=>this.setState({visible: false})} visible={this.state.visible}/>
            </View>
        )
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
    box: {
        marginBottom: layout.GAP_VERTICAL_MID,
        backgroundColor: '#fff'
    },
    btn: {
        marginTop: 0,
    },
})

//路由
const Setting = {
    screen: Views,
    navigationOptions: {
        header: null,
    },
    name: 'Setting',
    sign: true
};

export default Setting;